5777
24040 
Jag är en absolut nybörjare, har självstuderat i två veckor som förberedelse för en bootcamp som kommer om en månad. I ett försök att förbättra mina färdigheter och "lära mig tänka som en utvecklare" har jag tagit på mig ett projekt som försöker lösa ett verkligt problem.
Min fru driver ett företag som kräver att hon genererar fakturor för sina kunder. Jag försöker använda HTML och JavaScript för att bygga en webbaserad applikation som gör att hon snabbt kan skapa anpassade fakturor istället för att skriva ut dem manuellt varje gång.
I den aktuella versionen begär en uppmaning ett nummer från henne. Detta nummer genererar lika många rader med tre kolumner i HTML. Detta gör att hon kan anpassa fakturan med det exakta antalet fält hon behöver.
Kolumn 1 innehåller produktnamnet. I samma rad innehåller kolumn 2 enhetsräkningen, medan kolumn 3 innehåller den totala kostnaden för den produkten, vilket är baspriset multiplicerat med enhetsräkningen. Jag vill att denna beräkning ska ske med ett knapptryck. Men jag sitter fast.
För att kunna utföra matematiken måste jag kunna få heltal från varje rad och kolumn och skicka dem till en funktion. Men eftersom varje rad och kolumn genererades automatiskt har de inga unika attribut och kan därför inte identifieras. Jag kan utföra matematiken i varje kolumn, men inte över varje rad.
Eftersom jag är så ny, har jag bara lärt mig från ett par inledande Codecademy-kurser och några YouTube-videor, jag vet inte hur jag ska utvärdera om jag närmar mig projektet helt fel, eller om det finns något trick jag saknar, eller om det bara finns något som inte har lärt sig än. Om någon med viss expertis kunde knuffa mig i rätt riktning skulle jag verkligen uppskatta det!
Jag har bifogat all kod till det här inlägget. Ber om ursäkt om det är en hemsk röra. Gå lätt på mig, jag är nybörjare!
const invDate = Date ();
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = funktion () {
let invoicedName = prompt ('Vem är den här fakturan gjord för?', 'Ange ett namn');
let productFields = Number (prompt ('Hur många produktnamn på denna faktura?', 'Ange ett nummer'));
låt fält = ''
låt dynHtml = ''
om (fakturerat Namn! = null && productFields! = null) {
för (låt i = 1; i <= productFields; i ++) {
fält + = fält};
} else {alert ('Ange giltiga ingångar.');
};
dynHtml = "
  
 
" +
"
 FAKTURA 
" +
"
 Förberedd för: " + fakturerat namn + ", på" +
"
" + invDate + "
 
 
" +
fält + "
 
" +
" 
";
document.write (dynHtml);
document.getElementById ('beräkna'). onclick = funktion getQtyFields () {
låt qtyInputs = document.getElementsByName ('qty'),
resultQty = 0;
för (låt j = 0; j
2020-12-15 08:12:22 
Som du sa är ditt huvudproblem att hitta ett sätt att ge varje inmatningsfält inom sin egen rad sin egen unika identifierare. På så sätt kan du beräkna priset för varje rad och infoga det i prisfältet.
Du måste först börja med fälten:
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = funktion () {
...
för (låt i = 1; i <= productFields; i ++) {
fält + = fält};
...
};
Varje grupp behöver sin egen identifierare. På det sättet kan du senare hänvisa till varje ingång i varje rad för att beräkna det totala totalpriset. Klassattributet är något du kan tilldela till flera element för att hänvisa till dem senare. Den här klassen kan vara vad som helst så länge den inte strider mot klassen för någon annan rad. Du kan använda i i loop som din identifierare, eftersom det ändras för varje loop.
för (låt i = 1; i <= productFields; i ++) {
var field = " " +
" " +
"  
 
";
fält + = fält
};
Detta lägger till klassraden- {i} i varje fält i varje rad. Bättre än, du kan omformulera detta till sin egen funktion
funktion genereraFält (i) {
returnera " " +
" " +
"  
 
";
}
för (låt i = 1; i <= productFields; i ++) {
fält + = genereraFält (i);
};
Du får något som liknar följande html
 
 
  
 

 
 
  
 

 
 
  
 

Nu i din beräkningsfunktion kan du referera till dessa rader och beräkna deras pris. Här kan du slinga över inmatningsfälten 'objekt'.
document.getElementById ('beräkna'). onclick = funktion getQtyFields () {
låt itemInputs = document.getElementsByName ('item')
för (låt i = 0; i )
för (låt i = 0; i